import React, { useState } from 'react'
import './index.css'
import { Button, Popup, Swiper } from 'antd-mobile';
import { useNavigate } from 'react-router-dom';


export default function MyApp() {
    const history = useNavigate();

    const [visible, setVisible] = useState(true)


    const jumpPage = () => {
        history('/home')
    };

    return (
        <>
            <Popup position='bottom' visible={visible} destroyOnClose>
                <Swiper loop={false}>
                    <Swiper.Item>
                        <div
                            className={'contentFull'}
                            style={{ background: '#ace0ff' }}
                        >
                            1
                        </div>
                    </Swiper.Item>
                    <Swiper.Item>
                        <div
                            className={'contentFull'}
                            style={{ background: '#bcffbd' }}
                        >
                            1
                        </div>
                    </Swiper.Item>
                    <Swiper.Item>
                        <div className={'contentFull'}>
                            <Button
                                onClick={() => {
                                    setVisible(false);
                                    jumpPage()
                                }}
                            >
                                开始使用
                            </Button>
                        </div>
                    </Swiper.Item>
                </Swiper>
            </Popup>
        </>
    )
}